<template>
  <BasicModal
    v-bind="$attrs"
    @register="registerModal"
    title="创建实体版本"
    :destroyOnClose="true"
    :mask-closable="false"
    @ok="handleSubmit"
  >
    <div style="height: 80%">
      <Collapse ref="collapseRef" :mode="'restore'" @success="handleSuccess" />
    </div>
  </BasicModal>
</template>

<script setup lang="ts">
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import Collapse from './Collapse.vue';
  import { ref } from 'vue';
  const emit = defineEmits(['success']);
  const collapseRef = ref();
  const collapseFormValues = ref<any>();
  const versionId = ref('');
  const [registerModal] = useModalInner(async (data) => {
    versionId.value = data.record.id;
  });

  const handleSubmit = async () => {
    await collapseRef.value.collectValues();
    emit('success', {
      key: 'restore',
      versionId: versionId.value,
      collapseFormValues: collapseFormValues.value,
    });
  };

  const handleSuccess = (val) => {
    collapseFormValues.value = Object.assign({}, val);
  };
</script>
